<template>
  <div>
    <upload-excel
      :before-upload="beforeUpload"
      :on-success="onSuccess"
    />
  </div>
</template>

<script>
import { importEmployee } from '@/api/employees'
import { getImportData } from '@/utils/excelData'
export default {

  methods: {
    // 上传校验 大小size和类型type
    // 校验成功之后必须return true
    beforeUpload(file) {
      const Size = file.size / 1024
      if (Size > 10) {
        this.$message({
          type: 'warning',
          message: '上传失败,文件不可大于10KB'
        })
        return false
      }
      return true
    },
    // 解析成功之后调用函数
    // {header:表头数据 数组    results:表单数据 对象数组}
    onSuccess(data) {
      console.log(data)
      // excel批量导入本质
      // 1,excel插件就是把excel表格文件解析成js识别的数据类型(解析工作)
      // 2,按照后端接口的要求 把excel表格解析好的数据 转化成接口要的数据结构
      importEmployee(getImportData(data.results))
      // 提示用户导入成功
      this.$message({
        type: 'success',
        message: '导入表格成功'
      })
      // 成功后跳转到上一级
      this.$router.back()
    }
  }
}
</script>

<style>

</style>
